﻿@page "/bar/bar2"
@attribute [RouteName("柱状图动画延迟")]
@using Blazor.ECharts.Options
@using Blazor.ECharts.Options.Enum
@using B = Blazor.ECharts.Options.Series.Bar

<div class="chart-container">
    <EBar Option="@Option1" Class="chart-fill"></EBar>
</div>

@code{
    private EChartsOption<B.Bar> Option1;

    protected override void OnInitialized()
    {
        base.OnInitialized();

        List<string> xAxisData = new List<string>();
        List<double> data1 = new List<double>();
        List<double> data2 = new List<double>();
        for (int i = 0; i < 100; i++)
        {
            xAxisData.Add("类目" + i);
            data1.Add(Math.Round((Math.Sin(i / 5) * (i / 5 - 10) + i / 6) * 5, 4));
            data2.Add(Math.Round((Math.Cos(i / 5) * (i / 5 - 10) + i / 6) * 5, 4));
        }

        Option1 = new EChartsOption<B.Bar>()
        {
            Title = new Blazor.ECharts.Options.Title() { Text = "柱状图动画延迟" },
            Legend = new Blazor.ECharts.Options.Legend() { Align = Align1.Left, Data = new[] { "bar", "bar2" } },
            Toolbox = new Toolbox()
            {
                Feature = new Feature()
                {
                    MagicType = new MagicType() { Type = new List<MagicTypeType>() { MagicTypeType.Stack, MagicTypeType.Tiled } },
                    DataView = new DataView(),
                    SaveAsImage = new SaveAsImage() { PixelRatio = 2 }
                }
            },
            Tooltip = new Blazor.ECharts.Options.Tooltip(),
            XAxis = new List<XAxis>()
            {
                new XAxis(){Data=xAxisData,Silent=false,SplitLine=new SplitLine(){Show=false } }
            },
            YAxis = new List<YAxis>() { new YAxis() },
            Series = new List<object>()
            {
                new B.Bar()
                {
                    Name="bar",
                    Data=data1,
                    AnimationDelay=new JFunc(){RAW="function (idx) {return idx * 10;}"}
                },
                new B.Bar()
                {
                    Name="bar2",
                    Data=data2,
                    AnimationDelay=new JFunc(){RAW="function (idx) {return idx * 10 + 100;}"}
                }
            },
            AnimationEasing = "elasticOut",
            AnimationDelayUpdate = new JFunc(){RAW="function (idx) {return idx * 5;}"}
        };
    }
}